<template>
	<view class="content with-tabbar">
		<div class="fontS48 lh-72 font-weight mt-42 mb-30">个人优势</div>
		<div class="pt-18 pb-18 pl-30 pr-30 bg-fff ">
			<view class=" resume-box  pb-15 pt-15">
				<view class=" lh-70  flex align-center fontS28 color-3">
					<div>优势总结</div>
					<div class="ml-auto color-6">{{ postForm.advantage ? postForm.advantage.length : 0 }} /2000
					</div>
				</view>
				<view class="form-cnt1">
					<textarea name="" id="" placeholder="个人优势" v-model="postForm.advantage" maxlength="2000"></textarea>
				</view>

			</view>

		</div>


		<div class="bottom">
			<div v-if="prePage === 'edit'" class="submitBtn fontS26" @click="toNext">保存</div>
			<div v-else class="submitBtn fontS26" @click="toNext">下一步</div>

		</div>



	</view>
</template>

<script>
import { editAdvantage, majorTree, onLineResume } from '@/api/resume'
const api = require("@/api/api.js").api;
export default {
	computed: {
		userInfo() {
			console.log(this.$store.getters.userInfo)
			return this.$store.getters.userInfo || {};
		},
	},
	data() {
		return {
			postForm: {},
			prePage: null

		}
	},
	async onLoad(options) {
		if (options.page) {
			this.prePage = options.page
			await this.getonLineResume()
		}
		if (uni.getStorageSync('creat4Info')) {
			this.postForm = JSON.parse(uni.getStorageSync('creat4Info'))
		}
	},
	methods: {
		async getonLineResume() {
			const { data } = await onLineResume()
			this.postForm = data

		},

		async toNext() {
			if (!this.postForm.advantage) {
				uni.showToast({ title: '请先输入个人优势', icon: 'none' });
				return false;
			}
			if (this.prePage === 'edit') {
				const { data } = await editAdvantage(this.postForm)
				uni.navigateBack({
					delta: 1
				})
			} else {
				uni.setStorageSync('creat4Info', JSON.stringify(this.postForm))
				uni.navigateTo({
					url: '/pages/resume/creat5'
				})
			}


		},

	}
}
</script>

<style lang="less" scoped>
.content {
	display: flex;
	flex-direction: column;

	padding: 20upx;
	// text-align: center;
	height: 100vh;
	overflow: hidden;
}

.title {
	font-size: 20px;
	font-weight: bold;
	margin-bottom: 20px;
}

.resume-box {
	.resume-title {
		width: 200upx;
	}

	.form-cnt {
		width: calc(100% - 240upx);

	}

	.form-cnt1 {
		width: 100%;

		textarea {
			width: 100%;
			line-height: 50upx;
			text-align: justify;
		}

	}

	.resume-input {
		width: calc(100% - 200upx);

		input {
			width: 100%;
			height: 50upx;
			line-height: 50upx;
		}
	}
}

.profession-cover {
	width: 100%;
	height: 100vh;
	position: fixed;
	left: 0;
	bottom: 0;
	background: rgba(0, 0, 0, .3);
	z-index: 888888;
}

.profession-box {
	bottom: 0;
	left: 0;
	width: 100%;
	height: 600upx;
	background: #F7F7F7;
	position: fixed;
	z-index: 999999;

	.profession-left {
		width: 50%;
		text-align: center;
		background: #fff;


		div {
			line-height: 90upx;

			&.active {
				background: #F7F7F7;
			}

		}
	}

	.profession-right {
		background: #F7F7F7;
		width: 50%;
		padding-left: 20upx;

		div {
			line-height: 90upx;

		}

	}
}

.bottom {
	padding-bottom: calc(constant(safe-area-inset-bottom) + 22upx);
	/*兼容 IOS<11.2*/
	padding-bottom: calc(env(safe-area-inset-bottom) + 22upx);
	/*兼容 IOS>11.2*/
}

.color-0d0 {
	color: #0D0D12;
}
</style>